//菜单栏
import {Sprite} from "../base/Sprite.js";
import {DataStore} from "../base/DataStore.js";
const screenWidth    = window.innerWidth
const screenHeight   = window.innerHeight
const rpx=DataStore.getRpx()
export class Bottom extends Sprite {
    constructor() {
        super()
        this.bottomsArr=[]
        // //各块高度61，61
        this.width=68;
        this.height=68
    }
    drawbottom1(){
        const image = Sprite.getImage('bottom1');
        super.draw(image,
            0, 0,
            image.width, image.height,
            image.width/8*rpx ,screenHeight-90*rpx,
            
            image.width/2, image.height/2);
            this.bottom1={x:screenWidth/4*3+image.width/8*rpx,y:screenHeight-90*rpx,name:'bottom1'}
            this.bottomsArr[0]=this.bottom1

    }

    drawbottom2(){
        const image = Sprite.getImage('bottom2');
        super.draw(image,
            0, 0,
            image.width, image.height,
            screenWidth/4+image.width/8*rpx ,screenHeight-90*rpx,
            
            image.width/2, image.height/2);

            this.bottom2={x:screenWidth/4*2+image.width/8*rpx,y:screenHeight-90*rpx,name:'bottom2'}
            this.bottomsArr[1]=this.bottom2
    }

    drawbottom3(){
        const image = Sprite.getImage('bottom3');
        super.draw(image,
            0, 0,
            image.width, image.height,
            screenWidth/4*2+image.width/8*rpx ,screenHeight-90*rpx,
            image.width/2, image.height/2);

        this.bottom3={x:screenWidth/4+image.width/8*rpx,y:screenHeight-90*rpx,name:'bottom3'}
        this.bottomsArr[2]=this.bottom3
    }

    drawbottom4(){
        const image = Sprite.getImage('bottom4');
        super.draw(image,
            0, 0,
            image.width, image.height,
            screenWidth/4*3+image.width/8*rpx ,screenHeight-90*rpx,
            image.width/2, image.height/2);
            // console.log(image.width/2)
            this.bottom4={x:image.width/8*rpx,y:screenHeight-90*rpx,name:'bottom4'}
            this.bottomsArr[3]=this.bottom4
    }

    checkIsFingerOnAir(obj) {//判断是否在按键上

        const deviation = 30
         const  a=this.bottomsArr.find(val=>{
            return !!(   obj.x >= val.x - deviation
                && obj.y >= val.y - deviation
                && obj.x <= val.x + this.width + deviation
                && obj.y <= val.y + this.height + deviation  )
             })
             if(a){
                this.selectBottom=a.name 
                console.log(a.name)
             }else{
                 this.selectBottom=''
             }
             
    }
        

    initbottomEvent(){
        console.log('dianji')
        DataStore.getInstance().canvas.addEventListener('touchend', ((e) => {
            e.preventDefault()
            let x = e.changedTouches[0].clientX
            let y = e.changedTouches[0].clientY
            
            this.checkIsFingerOnAir({'x':x,'y':y})
          }))
    }

    returnBottom(){
        // console.log(this.selectGirl
        return this.selectBottom
    }

}